<template>
  <div class="agreement">
    <v-title title="注册协议" />
    <div class="content" v-html="content" />
    <loading :show="loading" />
  </div>
</template>

<script>
import Loading from '@/components/Loading'
import Title from '@/components/Title'
import api from '@/api'
export default {
  name: 'RegisterAgreement',
  components: {
    'v-title': Title,
    Loading
  },
  data() {
    return {
      content: '',
      loading: false
    }
  },
  methods: {
    fetchData() {
      this.loading = true
      api.User.agreement().then(response => {
        const { data } = response
        this.content = data
      }).finally(() => {
        this.loading = false
      })
    }
  },
  created () {
    this.fetchData()
  }
}
</script>

<style scoped lang="stylus">
.agreement
  padding-top 45px
  .content
    margin 10px
    padding 10px
    line-height 25px
    text-align left
</style>
